/*
  学习目标：props校验的基本使用

  */

import React, { Component } from 'react';
//  1. 导入prop-types
import PropTypes from 'prop-types';

export default class App extends Component {
  render() {
    return (
      <div>
        <Header
          obj={{ age: '123' }}
          list={[]}
          name="123"
          title={<h1>hello React</h1>}
        ></Header>
      </div>
    );
  }
}

class Header extends React.Component {
  render() {
    return <div></div>;
  }
}

// 2. 设置组件的propTypes属性
Header.propTypes = {
  // 3. 设置props属性的类型
  list: PropTypes.array.isRequired,
  name: PropTypes.string,

  // 💥element是JSX
  title: PropTypes.element,

  obj: PropTypes.shape({
    age: PropTypes.number,
    gender: PropTypes.string,
  }),
};
